<?php
/**
 * File ini akan mengganti isi elemen body dari file index (file yang berisi option).
 * Penggantian dilakukan dengan ajax, melalui controller n
 * setelah variabel result yakni variabel berisi hasil pencarian dimasukkan ke file ini.
 * 
 */
?>
        <div id="container-wrapper" style="min-height: 100%">
            <div id="search-box" style="line-height: 72px">
                Query : <input style="font-size: 1.5em; height: 25px;width: 500px;" type="text" name="query"/>
                <button id="exex" class="button" style="padding-top: -1px">Search</button>
            </div>
            <div id="search-info" style="line-height: 48px">
                Ditampilkan <?= sizeof($results) ?> hasil dalam <?= $time ?> detik;
            </div>
            <div id="result-pane" style="display: inline-block;min-height: 100%">
                <!--<div style="position: relative;right:0px;width:100%;display: inline-block">-->
                <div class="uprollerDocument" onclick="uprollDocument()"></div>
                <div id="result-box" class="result-box">
                    <div id="inner-result-box">
                    <?php
                    foreach ($results as $result) {
                    ?>
                        <div class="result" style="padding-left: 100px;">
                            <div class="title"><a onclick="preview(this,<?=$result->no?>);"><?= $result->title ?></a></div>
                        </div>
                    <?php
                    }
                    ?>             
                    </div>
                </div>
                <div class="downrollerDocument" onclick="downrollDocument()"></div>
                <div id="result-preview" style="display: none">
                    <b>Author : </b>
                    <p id="result-author">Author</p>
                    <b>Content : </b>
                    <p id="result-content" class="content">Content</p>
                </div>
            </div>
        </div>
        <script>
            $("#result-preview").mouseleave(function(){
                $(this).fadeOut();
                $(".result.active").removeClass("active");
            });
		
            function preview (result,no){
                /*request document content*/
                $.get("<?=base_url()?>index.php/m/content/"+no, "", function(data){
                    $("#result-content").html(data.content);
                    $("#result-author").html(data.author);
                    $(".result.active").removeClass("active");
                    $(result).parents(".result").addClass("active");
                    $("#result-preview").show();
                }, "json");
            }
            
            
            function uprollDocument(){
                var mt = $('#inner-result-box').css("marginTop");
                var imt = parseInt(mt, 10);
                if (imt<0){
                   imt+=510;
                }
                $('#inner-result-box'+qno).animate({
                    marginTop:imt
                }, 500, "linear", function(){});
                
            }
            function downrollDocument(){
                var mt = $('#inner-result-box').css("marginTop");
                var h = $('#inner-result-box').height();
                var imt = parseInt(mt, 10);
                var diff = h + imt;
                if (diff>510) imt-=510;
                $('#inner-result-box'+qno).animate({
                    marginTop:imt
                }, 500, "linear", function(){});
            }
        </script>